@import "~./atlantic/zul/less/_header.less";

.z-paging {
	height: @barHeight;
	border: 1px solid @baseBorderColor;
	padding: @paddingSmall - 1 @paddingSize - 1;
	background: @pagingBackground;
	position: relative;

	ul {
		display: inline-block;
		margin: 0;
		padding: 0;
		& > li {
			display: inline;
		}
	}
	&-button {
		.fontStyle(@contentFontFamily, @baseFontSize, @fontWeightSemiBold, @pagingColor);
		display: inline-block;
		min-width: @buttonWidth;
		height: @buttonHeight;
		border: 1px solid @pagingBorderColor;
		margin-right: @baseWidth;
		padding: @paddingSmall - 1;
		line-height: @buttonHeight - @paddingSmall * 2;
		background: @pagingButtonBackground;
		text-align: center;
		vertical-align: top;
		text-decoration: none;
		white-space: nowrap;
		cursor: pointer;

		&:hover {
			color: @hoverColor;
			border-color: @hoverBorderColor;
			background: @hoverBackground;
			.boxShadow(inset 0 -1px 0 @hoverShadowColor);
			
			.z-paging-icon {
				color: @hoverColor;
			}
		}
		&:active {
			color: @activeColor;
			border-color: @activeBorderColor;
			background: @activeBackground;
			.boxShadow(inset 0px 1px 0 @activeShadowColor);
			
			.z-paging-icon {
				color: @activeColor;
			}
		}
		&[disabled] {
			color: @disabledColor;
			background: @disabledBackground;
			cursor: default;
			.opacity(@disabledOpacity);
			.boxShadow('none');

			&:hover,
			&:active {
				color: @disabledColor;
				border-color: @disabledBorderColor;
				background: @disabledBackground;
				cursor: default;
				.opacity(@disabledOpacity);
				.boxShadow('none');
			}
			.z-paging-icon,
			.z-paging-icon:hover {
				color: @disabledColor;
			}
		}
	}
	.z-paging-icon {
		.iconFontStyle(@fontSizeXLarge, @pagingIconColor);
	}
	&-selected,
	&-selected:hover,
	&-selected:active {
		font-weight: @fontWeightBold;
		color: @pagingSelectedColor;
		border-color: @pagingSelectedBorderColor;
		background: @pagingSelectedBackground;
		.boxShadow(none);
		cursor: default;
	}
	&-input {
		.fontStyle(@contentFontFamily, @baseFontSize, @baseFontWeight, @baseTextColor);
		height: @buttonHeight;
		border: 1px solid @baseBorderColor;
		padding: @paddingSmall - 1;
		line-height: @buttonHeight - @paddingSmall * 2;
		vertical-align: baseline;
	}
	&-text {
		.fontStyle(@contentFontFamily, @baseFontSize, @baseFontWeight, @baseTextColor);
		margin-right: @baseWidth;
	}
	&-info {
		.fontStyle(@contentFontFamily, @baseFontSize, @baseFontWeight, @baseTextColor);
		.displaySize(inline-block, auto, @buttonHeight);
		line-height: @buttonHeight;
		position: absolute;
		right: @baseWidth;
	}
}

.ie9 .z-paging-input {
	line-height: normal;
}
.ie8 .z-paging-button {
	min-width: @buttonWidth - @paddingSmall * 2;
}
